import { POP_CLOSE_TYPE, POP_SHOW_TYPE } from "../constants/Enums";
import PopUpManager from "../manager/PopUpManager";
import UserData from "../user/UserData";
import BaseWindow from "./BaseWindow";

const { ccclass, property } = cc._decorator;

@ccclass
export default class BasePanel extends BaseWindow {
    /**灰色背景，可点击 */
    bg: cc.Node = null;
    /**动画区块 */
    content: cc.Node = null;
    /**开启数据 */
    data: any = null;
    /**开启动画类型 */
    showType = POP_SHOW_TYPE.DEFAULT;
    /**关闭动画类型 */
    closeType = POP_CLOSE_TYPE.DEFAULT;
    callBack: Function = null;
    scrollV = 5;
    showPanel(data: any, showType: number = 0) {
        this.callBack = null;
        this.data = data;
        this.showType = showType;
        //UserData.isSpace=false;
        this.initPanel();
        switch (showType) {
            case POP_SHOW_TYPE.BOTTOM_TO_TOP:
                this.closeType = POP_CLOSE_TYPE.TOP_TO_BOTTOM;
                this._bottomToTop();
                break;
            case POP_SHOW_TYPE.TOP_TO_BOTTOM:
                this.closeType = POP_CLOSE_TYPE.BOTTOM_TO_TOP;
                this._topToBottom();
                break;
            case POP_SHOW_TYPE.LEFT_TO_RIGHT:
                this.closeType = POP_CLOSE_TYPE.RIGHT_TO_LEFT;
                this._leftToRight();
                break;
            case POP_SHOW_TYPE.RIGHT_TO_LEFT:
                this.closeType = POP_CLOSE_TYPE.LEFT_TO_RIGHT;
                this._rightToLeft();
                break;
            case POP_SHOW_TYPE.SCALE:
                this.closeType = POP_CLOSE_TYPE.DEFAULT;
                this._scaleIn();
                break;
            case POP_SHOW_TYPE.FADE:
                this.closeType = POP_CLOSE_TYPE.FADE;
                this._fadeIn();
                break;
            default:
                break;
        }
    }
    /**进场动画完成 */
    onIn() {
        
    }
    /**离场动画完成 */
    onOut() {
        this.content.opacity = 0;
    }
    getInTime(type: number = 0) {
        // if (type == 0) return this.content.height / (this.scrollV * 1000);
        // if (type == 1) return this.content.width / (this.scrollV * 1000);
        return 0.3;
    }
    getOutTime(type: number = 0) {
        if (type == 0) return this.content.height / (this.scrollV * 1500);
        if (type == 1) return this.content.width / (this.scrollV * 1500);
        return 0.2;
    }
    _bottomToTop() {
        this.content.y = -this.node.height / 2 - this.content.height / 2;
        this.scheduleOnce(()=>{ this.content.opacity = 255;})
        cc.tween(this.content).to(this.getInTime(), { y: -this.node.height / 2 + this.content.height / 2 }).call(() => {
            this.onIn();
        }).start();
    }
    _topBackBottom() {
        let callBack = this.callBack;
        cc.tween(this.content).to(this.getOutTime(), { y: -this.node.height / 2 - this.content.height / 2 }).call(() => {
            this.onOut();
            if (callBack) {
                callBack(this.node);
            }
        }).start();
    }
    _topToBottom() {
        this.content.y = this.node.height / 2 + this.content.height / 2;
        this.scheduleOnce(()=>{ this.content.opacity = 255;})
        cc.tween(this.content).to(this.getInTime(), { y: this.node.height / 2 - this.content.height / 2 }).call(() => {
            this.onIn();
        }).start();
    }
    _bottomBackTop() {
        let callBack = this.callBack;
        cc.tween(this.content).to(this.getOutTime(), { y: this.node.height / 2 + this.content.height / 2 }).call(() => {
            this.onOut();
            if (callBack) {
                callBack(this.node);
            }
        }).start();
    }
    _leftToRight() {
        this.content.x = -this.node.width / 2 - this.content.width / 2;
        this.scheduleOnce(()=>{ this.content.opacity = 255;})
        cc.tween(this.content).to(this.getInTime(1), { x: (this.node.width - this.content.width) / 2 }).call(() => {
            this.onIn();
        }).start();
    }
    _rightBackLeft() {
        let callBack = this.callBack;
        cc.tween(this.content).to(this.getOutTime(1), { x: -this.node.width / 2 - this.content.width / 2 }).call(() => {
            this.onOut();
            if (callBack) {
                callBack(this.node);
            }
        }).start();
    }
    _rightToLeft() {
        this.content.x = this.node.width / 2 + this.content.width / 2;
        this.scheduleOnce(()=>{ this.content.opacity = 255;})
        cc.tween(this.content).to(this.getInTime(1), { x: (this.node.width - this.content.width) / 2 }).call(() => {
            this.onIn();
        }).start();
    }
    _leftBackRight() {
        let callBack = this.callBack;
        cc.tween(this.content).to(this.getOutTime(1), { x: this.node.width / 2 + this.content.width / 2 }).call(() => {
            this.onOut();
            if (callBack) {
                callBack(this.node);
            }
        }).start();
    }
    _scaleIn() {
        this.content.scale = 1;
        this.content.opacity = 255;
        cc.tween(this.content).to(0.1, { scale: 1.1 }).to(0.1, { scale: 1 }).call(() => {
            this.onIn();
        }).start();
    }
    _scaleOut() {
        let callBack = this.callBack;
        cc.tween(this.content).to(0.2, { scale: 0.5, opacity: 100 }).call(() => {
            this.onOut();
            if (callBack) {
                callBack(this.node);
            }
        }).start();
    }
    _fadeIn() {
        this.node.opacity = 0;
        cc.tween(this.node).to(0.2, { opacity: 255 }).call(() => {
            this.onIn();
        }).start();
    }
    _fadeOut() {
        let callBack = this.callBack;
        cc.tween(this.node).to(0.2, { opacity: 100 }).call(() => {
            this.onOut();
            if (callBack) {
                callBack(this.node);
            }
        }).start();
    }
    initPanel() {
        
    }
    onClose() {
        PopUpManager.Inst.close(this.node);
        //UserData.isSpace=true;
    }
    closePanel(callBack: Function = null) {
        this.callBack = callBack;
        switch (this.closeType) {
            case POP_CLOSE_TYPE.BOTTOM_TO_TOP:
                this._bottomBackTop();
                break;
            case POP_CLOSE_TYPE.TOP_TO_BOTTOM:
                this._topBackBottom();
                break;
            case POP_CLOSE_TYPE.LEFT_TO_RIGHT:
                this._leftBackRight();
                break;
            case POP_CLOSE_TYPE.RIGHT_TO_LEFT:
                this._rightBackLeft();
                break;
            case POP_CLOSE_TYPE.SCALE:
                this._scaleOut();
                break;
            case POP_CLOSE_TYPE.FADE:
                this._fadeOut();
                break;
            default:
                this.onOut();
                callBack(this.node);
                break;
        }
    }
}
